/**
 * Created by fangshufeng on 2017/7/13.
 */

import React,{Component} from 'react';
import {
    View,
    Text,
    StyleSheet,
    Image,
    TextInput,
} from 'react-native';


class  TestDemo2 extends Component {

    render(){
        return (
            <View style={styles.mainStyle}>

               <View style={styles.topViewStyle}>
                   <Image source={require('./Demo2Icon/delBtn@2x.png')} style={{width:24,height: 24 }}/>
                   <Text>注册</Text>
               </View>

                <View style={styles.logoStyle}>
                    <Image source={require('./Demo2Icon/logo.png')} style={{width:90,height:90}}/>
                </View>

                <View style={styles.textInputItemStyle}>
                    <TextInput style={styles.textInputStyle} placeholder='请输入账号' />
                    <TextInput style={styles.textInputStyle} placeholder='请输入密码'  />
                </View>

                <View style={styles.loginButtonStyle}>
                    <Text style={{color:'white'}}>登录</Text>
                </View>

            </View>
            );

    }
}


let Dimensions = require('Dimensions');
let {width} = Dimensions.get('window');

const  styles = StyleSheet.create({
    mainStyle:{
        flex:1,
        // justifyContent:'center',
        // alignItems:'center',
    },
    topViewStyle:{
        flexDirection:'row',
        marginTop:21,
        justifyContent:'space-between',
        marginLeft:20,
        marginRight:20,
        alignItems:'center'

    },
    logoStyle: {

        flexDirection:'row',
        justifyContent:'center',
        marginTop:80,
    },

    textInputItemStyle:{
      marginTop:40,
    },
    textInputStyle:{
        width:width * 0.9,
        height:44,
        marginLeft:width* 0.1 / 2,
        borderWidth:1,
        borderColor:'#e0e0e0',
        marginTop:10,
        borderRadius:3,
        textAlign:'center',
        // alignment:'center',
    },
    loginButtonStyle:{
      width:width* 0.9,
      height:44,
      marginLeft:width* 0.1 / 2,
      backgroundColor:'blue',
      justifyContent:'center',
        alignItems:'center',
        borderWidth:1,
        borderColor:'#e0e0e0',
        marginTop:30,
        borderRadius:5,
    },
}
);

// module.exports = TestDemo2;
export default TestDemo2;